<template>
	<view class="bg">
		<view class="title">欢迎-智慧社区</view>
		<view class="content">

			<u--form labelPosition="left" :model="reqData" :rules="rules" ref="editform1" :style="{width: '95%' }"
				class="content">
				<u-form-item :labelWidth="90" label="真实姓名" prop="uname" borderBottom>
					<view>
						<input maxlength="15" v-model="reqData.uname" class="uni-input" placeholder="请输入真实姓名"
							@blur="reqData.uname = reqData.uname.replace(/\s*/g,'')"></input>
					</view>
				</u-form-item>
				<u-form-item label="电话号码" :labelWidth="90" prop="phone" borderBottom>
					<view>
						<input maxlength="11" v-model="reqData.phone" type="number" placeholder="请输入电话号码"></input>
					</view>
				</u-form-item>
				<u-form-item label="身份证" :labelWidth="90" prop="identity" borderBottom>
					<view>
						<input v-model="reqData.identity" type="number" placeholder="请输入身份证"></input>
					</view>
				</u-form-item>
				<u-form-item label="住址" :labelWidth="90" prop="home" borderBottom>
					<view>
						<u--textarea v-model="reqData.home" placeholder="请输入住址: xx单元xx栋xx号"></u--textarea>
					</view>
				</u-form-item>
			</u--form>
		</view>
		<at-submit-btn txt="完成" @submit="submit"></at-submit-btn>
	</view>
</template>

<script>
	import {
		register
	} from '@/common/http.api.js'
	import AtSubmitBtn from '@/components/AtSubmitBtn'
	export default {
		components: {
			AtSubmitBtn
		},
		data() {
			return {
				rules: {
					uname: {
						required: true,
						message: '必填'
					},
					phone: {
						required: true,
						message: '必填,且是数字',
						type: 'number',

					},
					identity: {
						required: true,
						message: '必填,且是数字',
						type: 'number',
					},
					home: {
						required: true,
						message: '必填'
					}
				},
				reqData: {
					code: '',
					uname: '',
					phone: '',
					home: '',
					identity: '',
					avatarUrl: ''
				}
			};
		},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.editform1.setRules(this.rules)
		},
		methods: {
			submit() {
				this.$refs.editform1.validate().then(async () => {
					uni.$loading()
					// 处理换行
					let _this = this
					wx.getUserProfile({
						desc: '用于完善用户资料',
						success: async (res) => {
							uni.$loading('正在登录...')
							let {
								avatarUrl
							} = res.userInfo
							_this.reqData.avatarUrl = avatarUrl
							// 获取用户code
							_this.reqData.uID = uni.getStorageSync('uID')
							// 后端登录
							const result = await register(_this.reqData)
							_this.$store.commit('getUserInfo', result.data)
							setTimeout(() => {
								uni.switchTab({
									url: '/pages/home/home'
								})
							}, 1500)

						}
					})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.bg {
		position: fixed;
		width: 100%;
		height: 100%;
		background: linear-gradient(to left, #5866f5, #4492f0);
	}

	.title {
		margin-top: 100rpx;
		font-size: 18px;
		text-align: center;
		font-weight: bold;
	}

	.content {
		border: 1rpx solid #eee;
		width: 90%;
		margin: 100rpx auto;
		padding: 20rpx;
		border-radius: 20rpx;
		background-color: #fff;
	}
</style>
